/* eslint-disable no-unused-vars */
import { ask } from '../api/index';
import { historyMessage } from './TestData';

class IntentManager {

    intentList = []; // 实体列表
    intentListAtHistory = []; // 历史记录列表
    lastHistoricalIntentKey = null; // 最后一条历史消息的key,用于判断是否加载完毕,默认为null

    // 历史记录提示信息
    HISTORY_STATUS = {
        loading: '加载中...',
        noMore: '没有更多了',
        error: '加载失败',
        more: '下滑/点击查看更多',
    };
    currentHistoryStatus = this.HISTORY_STATUS.more; // 当前历史记录状态

    constructor() {
        this.startScreenGesture(); // 启动屏幕手势
    }

    /**
     * 新增实体
     * @param {Object} intent 
     */
    addIntent(intent) {
        if (intent) {
            // 实体有效
            if (intent.text) {
                // text存在
                if (intent.type === 'UserMessage') {
                    // 用户消息，执行HTML标签转义
                    // intent.text = this.htmlEncode(intent.text);
                    ask({ msg: intent.text }).then((res) => {
                        const { code, data, message } = res;
                        if (code == 200) {
                            this.intentList.push({
                                type: 'BotMessage',
                                text: data,
                            })
                            this.scrollToBottom(this.getBotBody());
                        } else {
                            alert(message);
                        }
                    });
                }
            }
        }
        this.intentList.push(intent);
        this.scrollToBottom(this.getBotBody());
    }

    /**
     * 加载历史实体
     * @param {Object} intent 
     */
    addIntentAtHistory(intent) {
        this.intentListAtHistory.push(intent);
    }

    /**
     * HTML转义
     * @param {String} html 
     * @returns 
     */
    htmlEncode(html) {
        if (html && html.replace) {
            return html.replace(/[<>&"']/g, (c) => {
                return { '<': '&lt;', '>': '&gt;', '&': '&amp;', '"': '&quot;', '\'': '&#39;' }[c];
            });
        } else {
            return '';
        }
    }

    /**
     * 滚动到底部
     * @param {string} el 滚轮所在元素
     */
    scrollToBottom(el) {
        if (el) {
            clearInterval(window.T);
            window.T = setInterval(() => {
                const wapperHeight = el.scrollHeight != el.clientHeight ? el.clientHeight : el.offsetHeight; // 滚轮容器的可视高度
                const scrollSurplusHeight = el.scrollHeight - el.scrollTop; // 滚轮条剩余的高度
                const newScrollSurplusHeight = wapperHeight; // 滚动条应当预留的高度
                if (scrollSurplusHeight > newScrollSurplusHeight) {
                    // 未滚动到预定位置
                    const l = 1.1 ^ ((scrollSurplusHeight - newScrollSurplusHeight) / 10.0) + 2
                    el.scrollTop += l;
                    if ((scrollSurplusHeight - newScrollSurplusHeight) < l) {
                        clearInterval(window.T);
                    }
                } else {
                    clearInterval(window.T);
                }
            }, 1);
        }
    }

    /**
     * 启动屏幕手势
     */
     startScreenGesture() {
        const that = this;
        window.addEventListener('touchstart', function (event) {
            // 屏幕触摸开始事件监听
            const touch = event.touches[0];
            const { screenX, screenY } = touch;
            window.toucheProcess = {
                start: { screenX, screenY },
                isTop: that.getBotBody().scrollTop === 0,
            }
        });
        window.addEventListener('touchmove', function (event) {
            // 屏幕触摸移动事件监听
            const touch = event.touches[0];
            const { screenX, screenY } = touch;
            window.toucheProcess.end = { screenX, screenY };
            const { start, end } = window.toucheProcess;
            if (start && end) {
                if (end.screenY - start.screenY > 30) {
                    // 下滑
                    if (window.toucheProcess.isTop) {
                        // 在顶部进行的滑动,（微信浏览器此时会拦截touchend事件）
                        that.loadHistory(); // 加载历史记录
                    }
                    window.toucheProcess = {}; // 清空痕迹
                }
                if (start.screenY - end.screenY > 100) {
                    // 上滑
                    // alert('请不要向上滑动屏幕，请使用手机端访问。');
                    window.toucheProcess = {}; // 清空痕迹
                }
                if (start.screenX - end.screenX > 100) {
                    // 左滑
                    // alert('请不要向左滑动屏幕，请使用手机端访问。');
                    window.toucheProcess = {}; // 清空痕迹
                }
                if (end.screenX - start.screenX > 100) {
                    // 右滑
                    // alert('请不要向右滑动屏幕，请使用手机端访问。');
                    window.toucheProcess = {}; // 清空痕迹
                }
            }
        });
        window.addEventListener('touchend', function (event) {
            // 屏幕触摸结束事件监听
            const { start, end } = window.toucheProcess;
            if (start && end) {
                if (end.screenY - start.screenY > 100) {
                    // 下滑
                    if (window.toucheProcess.isTop) {
                        // 在顶部进行的滑动,（微信浏览器此时会拦截touchend事件）
                    }
                }
                if (start.screenY - end.screenY > 100) {
                    // 上滑
                    // alert('请不要向上滑动屏幕，请使用手机端访问。');
                }
                if (start.screenX - end.screenX > 100) {
                    // 左滑
                    // alert('请不要向左滑动屏幕，请使用手机端访问。');
                }
                if (end.screenX - start.screenX > 100) {
                    // 右滑
                    // alert('请不要向右滑动屏幕，请使用手机端访问。');
                }
            }
            if (start && !end) {
                // 点击事件
                // alert('请不要点击屏幕，请使用手机端访问。');
            }
        });
    }

    /** 加载历史消息 */
    loadHistory() {
        this.fixedScrollBar(); // 固定滚动条位置
        this.currentHistoryStatus = this.HISTORY_STATUS.loading;
        setTimeout(() => {
            // 模拟API请求的延迟
            for (let index = 0; index < 3; index++) {
                const key = `${new Date().getTime()}-${index}`;
                this.addIntentAtHistory({
                    key,
                    type: 'BotMessage',
                    text: historyMessage
                });
                if (index == 2) {
                    this.lastHistoricalIntentKey = key; // 记录最后一条历史消息的key
                }
            }
            this.currentHistoryStatus = this.HISTORY_STATUS.more;
        }, 1000);
    }

    /**
     * 加载历史消息时固定滚动条位置
     */
    fixedScrollBar() {
        this.lastHistoricalIntentKey = null; // 取消记录最后一条历史消息的key
        const oldTopEl = this.getBotHistoryEl().lastChild; // 当前最顶上的元素
        if (oldTopEl) {
            const t = setInterval(() => {
                oldTopEl.scrollIntoView();
                this.getBotBody().scrollTop -= this.getHistoryButtonEl().offsetHeight; // 减去历史消息按钮的高度
                if (document.getElementById(this.lastHistoricalIntentKey)) {
                    clearInterval(t);
                    this.lastHistoricalIntentKey = null; // 取消记录最后一条历史消息的key
                }
            }, 10);
        }
    }

    /**
     * @returns 获取消息展示区域的根容器
     */
    getBotBody() {
        // debugger
        return document.querySelector('.body');
    }

    /**
     * @returns 获取历史消息展示区域的根容器
     */
    getBotHistoryEl() {
        return document.querySelector('.history');
    }

    /**
     * @returns 获取历史记录按钮的容器
     */
    getHistoryButtonEl() {
        return document.querySelector('.history_button');
    }
}

export default IntentManager;